<template>
  <div id="edit-dict">
    <el-form :inline="true" :model="formData" ref="formData" :rules="validatorRules">
      <el-form-item label="字典名称" prop="typeName">
        <el-input v-model="formData.typeName"  :disabled="true"></el-input>
      </el-form-item>
      <el-form-item label="键名" prop="name">
        <el-input v-model="formData.name"  maxlength="20" placeholder="不超过20个字符"></el-input>
      </el-form-item>
	  <el-form-item label="code" prop="code">
	    <el-input v-model="formData.code"  maxlength="20" placeholder="不超过20个字符"></el-input>
	  </el-form-item>
      <el-form-item label="排序" prop="sort">
        <el-input v-model="formData.sort" maxlength="4" placeholder="请输入排序号"></el-input>
      </el-form-item>
      <el-form-item label="备注" prop="remark">
        <el-input v-model="formData.remark" maxlength="100" placeholder="请输入备注"></el-input>
      </el-form-item>
    </el-form>
    <div class="button-bar">
      <el-button @click="cancel">取 消</el-button>
      <el-button type="primary"  @click="submit">确 定</el-button>
    </div>
  </div>
</template>
<script>
  export default {
    props:{
      initData:{
        type:Object,
        default:{}
      },
    },
    data(){
      return{
        formData:{
			id:"",
          name:"",
		  code:"",
          sort:'',
          remark:"",
		  typeName:'',
		  parentCode :'',
		  parentId:"",
        },
        validatorRules:{
          name:[
            {required: true, message: '请输入', trigger: 'blur'},
          ]
        },

      }
    },
    watch:{
      initData:{
        handler(newv) { 
          if(newv && newv.parentId=="0"){//新建
			this.formData.typeName=newv.name
			this.formData.parentCode=newv.code
			this.formData.parentId=newv.id
			this.formData.name=""
			this.formData.code=""
			this.formData.sort=""
			this.formData.remark=""
          }else{//编辑
            this.formData=Object.assign({},newv);
          }
        },
        deep: true
      }
    },
    methods:{
      submit(){
        var isValidate=false
        this.$refs.formData.validate((bool)=>{
            isValidate=bool
        })
        if(!isValidate){return}
        let submitData=this.formData
        submitData.moduleName="数据字典"
        this.$http.editDict(submitData)
        .then((res)=>{
            this.$message.success("操作成功!")
            this.$emit('closeDialog',false)
            this.$emit("update",'key')
            this.formData.name=""
			this.formData.code=""
            this.formData.sort=""
            this.formData.remark=""
        }).catch((err)=>{
          throw(err)
        })
        
      },
      cancel(){
        this.$emit('closeDialog',false)
        this.$emit("update",'key')
      },

      checkSort(rule, value, callback){
        if(value && value.length>0 && !value.match(/^\d*$/g)){//全为数字字符串
          callback(new Error('格式不正确,只能为非负整数!'));
        }else{
            callback()
        }
      }



    }
  }
</script>
<style scoped lang='scss'>
	#edit-dict{
		flex: 1;
		display: flex;
		flex-direction: column;
	}
  .button-bar{
    text-align: center;
    margin: 30px;
    .el-button{
      margin:0px 10px;
    }
  }


  /deep/ .el-form.el-form--inline{
    display: flex;
    flex-wrap: wrap;
	flex: 1;
    /deep/ .el-form-item{
      flex-basis: 40%;
      flex-grow: 1;
      margin: 10px;
    }
  }


</style>



